<template>
  <div class="accounting-info">
    <div class="table-desc-title">请审核供应商提报产品核算信息</div>
    <el-row class="table-desc">
      <el-col class="table-desc-tr" :span="24">
        <el-row>
          <el-col class="table-desc-item" :span="8">
            <div class="table-desc-item-label">填报方式</div>
            <div class="table-desc-item-value">{{
              modelInfo?.replyType ? $t18(`model.${modelInfo?.replyType}`) : '-'
            }}</div>
          </el-col>
          <el-col class="table-desc-item" :span="8">
            <div class="table-desc-item-label">填报企业</div>
            <!-- NOTE 在分供方提供时，供应商未回复时，不显示企业及联系人，否则会有问题 -->
            <div class="table-desc-item-value">{{
              modelInfo?.replyType ? modelInfo?.coopName || '-' : '-'
            }}</div>
          </el-col>
          <el-col class="table-desc-item" :span="8">
            <div class="table-desc-item-label">联系人</div>
            <div class="table-desc-item-value">
              <template v-if="modelInfo?.replyType">
                {{ modelInfo?.coopContacts || '-' }} {{ modelInfo?.coopPn || '-' }}
              </template>
              <template v-else>-</template>
            </div>
          </el-col>
        </el-row>
      </el-col>
      <template v-if="modelInfo?.replyType === 'LCA'">
        <el-col class="table-desc-tr" :span="24">
          <el-row>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">报告编号</div>
              <div class="table-desc-item-value">{{ modelInfo?.modelNo || '-' }}</div>
            </el-col>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">认证机构</div>
              <div class="table-desc-item-value">{{ modelInfo?.caName || '-' }}</div>
            </el-col>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">数据版本</div>
              <div class="table-desc-item-value">{{ modelInfo?.dataVersion || '-' }}</div>
            </el-col>
          </el-row>
        </el-col>
        <template v-if="isInclude(modelInfo)">
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">报告文件</div>
                <div class="table-desc-item-value">
                  <GFileLink
                    :url="modelInfo?.reportUrl"
                    :filename="modelInfo?.reportName"
                    ellipsis
                    v-if="modelInfo?.reportName && modelInfo?.reportUrl"
                  />
                  <span v-else>-</span>
                </div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">规格型号</div>
                <div class="table-desc-item-value">{{ modelInfo?.specification || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">用量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.weight || '-' }} {{ modelInfo?.weightUnit || '-' }}</div
                >
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算数量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.num || '-' }} {{ modelInfo?.unit || '-' }}</div
                >
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">数据采集周期</div>
                <div class="table-desc-item-value">{{ modelInfo?.baseYear || '-' }}年</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品产地</div>
                <div class="table-desc-item-value">{{ modelInfo?.manufactureAddress || '-' }}</div>
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算边界</div>
                <div class="table-desc-item-value">{{
                  $t18(`factor.${modelInfo?.accountBoundary}`)
                }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品编码</div>
                <div class="table-desc-item-value">{{ modelInfo?.code || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">适用产品</div>
                <div class="table-desc-item-value">{{
                  modelInfo?.applyProductCode?.join('、') || '-'
                }}</div>
              </el-col>
            </el-row>
          </el-col>
        </template>
        <template v-else>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">报告文件</div>
                <div class="table-desc-item-value">
                  <GFileLink
                    :url="modelInfo?.reportUrl"
                    :filename="modelInfo?.reportName"
                    ellipsis
                    v-if="modelInfo?.reportName && modelInfo?.reportUrl"
                  />
                  <span v-else>-</span>
                </div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">规格型号</div>
                <div class="table-desc-item-value">{{ modelInfo?.specification || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算数量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.num || '-' }} {{ modelInfo?.unit || '-' }}</div
                >
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">数据采集周期</div>
                <div class="table-desc-item-value">{{ modelInfo?.baseYear || '-' }}年</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品产地</div>
                <div class="table-desc-item-value">{{ modelInfo?.manufactureAddress || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算边界</div>
                <div class="table-desc-item-value">{{
                  $t18(`factor.${modelInfo?.accountBoundary}`)
                }}</div>
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品编码</div>
                <div class="table-desc-item-value">{{ modelInfo?.code || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="16">
                <div class="table-desc-item-label">适用产品</div>
                <div class="table-desc-item-value">{{
                  modelInfo?.applyProductCode?.join('、') || '-'
                }}</div>
              </el-col>
            </el-row>
          </el-col>
        </template>
      </template>
      <template v-else-if="modelInfo?.replyType === 'MODEL'">
        <el-col class="table-desc-tr" :span="24">
          <el-row>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">模型产品</div>
              <div class="table-desc-item-value">{{ modelInfo?.name || '-' }}</div>
            </el-col>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">模型数据</div>
              <div class="table-desc-item-value">
                <el-button type="primary" link @click="routerToModel">前往查看</el-button>
              </div>
            </el-col>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">数据版本</div>
              <div class="table-desc-item-value">{{ modelInfo?.dataVersion || '-' }}</div>
            </el-col>
          </el-row>
        </el-col>
        <template v-if="isInclude(modelInfo)">
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">规格型号</div>
                <div class="table-desc-item-value">{{ modelInfo?.specification || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">用量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.weight || '-' }} {{ modelInfo?.weightUnit || '-' }}</div
                >
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算数量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.num || '-' }} {{ modelInfo?.unit || '-' }}</div
                >
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">数据采集周期</div>
                <div class="table-desc-item-value">{{ modelInfo?.baseYear || '-' }}年</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品产地</div>
                <div class="table-desc-item-value">{{ modelInfo?.manufactureAddress || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算边界</div>
                <div class="table-desc-item-value">{{
                  $t18(`factor.${modelInfo?.accountBoundary}`)
                }}</div>
              </el-col>
            </el-row>
          </el-col>
        </template>
        <template v-else>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">规格型号</div>
                <div class="table-desc-item-value">{{ modelInfo?.specification || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">核算数量</div>
                <div class="table-desc-item-value"
                  >{{ modelInfo?.num || '-' }} {{ modelInfo?.unit || '-' }}</div
                >
              </el-col>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">数据采集周期</div>
                <div class="table-desc-item-value">{{ modelInfo?.baseYear || '-' }}年</div>
              </el-col>
            </el-row>
          </el-col>
          <el-col class="table-desc-tr" :span="24">
            <el-row>
              <el-col class="table-desc-item" :span="8">
                <div class="table-desc-item-label">产品产地</div>
                <div class="table-desc-item-value">{{ modelInfo?.manufactureAddress || '-' }}</div>
              </el-col>
              <el-col class="table-desc-item" :span="16">
                <div class="table-desc-item-label">核算边界</div>
                <div class="table-desc-item-value">{{
                  $t18(`factor.${modelInfo?.accountBoundary}`)
                }}</div>
              </el-col>
            </el-row>
          </el-col>
        </template>
      </template>
      <el-col class="table-desc-tr" :span="24">
        <el-row>
          <el-col class="table-desc-item" :span="24">
            <div class="table-desc-item-label">取舍规则</div>
            <div class="table-desc-item-value">{{ modelInfo?.arRules || '-' }}</div>
          </el-col>
        </el-row>
      </el-col>
      <template v-if="modelInfo?.replyType === 'LCA'">
        <el-col class="table-desc-tr" :span="24">
          <el-row>
            <el-col class="table-desc-item" :span="24">
              <div class="table-desc-item-label">核算结果</div>
              <div class="table-desc-item-value">
                {{ customRenderResultUnit(modelInfo?.accountResult) }}
              </div>
            </el-col>
          </el-row>
        </el-col>
      </template>
      <template v-else-if="modelInfo?.replyType === 'MODEL'">
        <el-col class="table-desc-tr" :span="24">
          <el-row>
            <el-col class="table-desc-item" :span="8">
              <div class="table-desc-item-label">核算日期</div>
              <div class="table-desc-item-value">{{ modelInfo?.accountTime || '-' }} </div>
            </el-col>
            <el-col class="table-desc-item" :span="16">
              <div class="table-desc-item-label">核算结果</div>
              <div class="table-desc-item-value">
                {{ customRenderResultUnit(modelInfo?.accountResult) }}
              </div>
            </el-col>
          </el-row>
        </el-col>
      </template>
    </el-row>
  </div>
</template>
<script lang="ts" setup name="AccountingAuditInfo">
import { ref, defineProps } from 'vue';
import GFileLink from '@/components/GFileLink/index.vue';
import { getModelBasicInfo } from '@/apis/todo/flowBusiness';
import type {
  GetRequestInfoResult,
  GetModelBasicInfoResult
} from '@/apis/todo/model/flowBusinessModel';
import { weightUnitArr } from '@/constants/enum';
import { renderResultUnit } from '@/utils';
import { useRouter } from 'vue-router';

interface AccountAuditInfoProps {
  requestNo: string;
  modelBaseInfo: GetRequestInfoResult;
}
const props = defineProps<AccountAuditInfoProps>();
const modelInfo = ref<GetModelBasicInfoResult>();
const router = useRouter();
async function getData() {
  try {
    modelInfo.value = await getModelBasicInfo(
      props.requestNo,
      props.modelBaseInfo.activeFlag ? '1' : ''
    );
    console.log('modelInfo.value', modelInfo.value);
  } catch (error) {
    console.log('error', error);
  }
}

function routerToModel() {
  router.push(
    `/dataRequest/receiveRequest/modelDetail?modelNo=${modelInfo.value?.modelNo}&requestNo=${props.requestNo}&modelName=${modelInfo.value?.name}`
  );
}

function customRenderResultUnit(val: any) {
  if (val === null || val === undefined) {
    return '如需查看具体值请升级至付费版';
  } else {
    return renderResultUnit(Number(val));
  }
}
const isInclude = (row: any) => {
  if (weightUnitArr.indexOf(row.unit) > -1) {
    return false;
  } else {
    return true;
  }
};

getData();
</script>
<style lang="scss" scoped>
.accounting-info {
  .table-desc-title {
    padding: 11px 0;
    height: 42px;
    font-size: 14px;
    font-family: SourceHanSansCN-Bold, SourceHanSansCN;
    font-weight: bold;
    color: #212529;
    line-height: 20px;
  }
  .table-desc {
    border: 1px solid #e4e7ed;
    border-radius: 4px;
    overflow: hidden;
    .table-desc-tr {
      border-top: 1px solid #e4e7ed;
      &:first-child {
        border-top: 0;
      }
      .table-desc-item {
        border-left: 1px solid #e4e7ed;
        &:first-child {
          border-left: 0;
        }
      }
    }
  }
  .table-desc-item {
    display: flex;
    min-height: 40px;
    .table-desc-item-label {
      padding: 9px 16px;
      flex-shrink: 0;
      width: 160px;
      height: 100%;
      background: #f6f9fa;
      border-right: 1px solid #e4e7ed;
      font-size: 14px;
      font-family: SourceHanSansCN-Regular, SourceHanSansCN;
      font-weight: 400;
      color: #212529;
      line-height: 20px;
    }
    .table-desc-item-value {
      padding: 9px 16px;
      flex: 1;
      width: calc(100% - 160px);
      height: 100%;
      font-size: 14px;
      font-family: SourceHanSansCN-Regular, SourceHanSansCN;
      font-weight: 400;
      color: #51596c;
      line-height: 20px;
    }
  }
}
</style>
